<template>
  <div>
    <open-app ref="openApp"></open-app>
    <div class="header">
      <a href="javascript:history.go(-1)"><img src="../assets/images/back.png" alt=""/></a>
      <span>注册成功</span>
    </div>
    <div class="prompt">
      <div class="result">
        <p><img src="../assets/images/success.png" alt=""></p>
        <b>注册成功</b>
      </div>
      <span v-if="isVoucher && tips">恭喜您，获得 {{voucherValue}} 元代金券</span>
      <p>会员号：{{gw}}</p>
      <div class="app-login" v-if="isVoucher && tips">
        代金券已放入钱包，使用期有限，请尽快使用
        <p>可登录<a href="#">壹键哥APP</a>,进入壹键哥查看</p>
      </div>
      <div class="app-login" v-else-if="isVoucher === false && tips">
        您将有机会获得一张代金券
        <p>可登录<a href="#">壹键哥APP</a>,进入壹键哥查看</p>
      </div>
      <div class="pages">
        <p><img src="../assets/images/page_01.jpg" alt=""/></p>
        <p><img src="../assets/images/page_02.jpg" alt=""/></p>
        <p><img src="../assets/images/page_03.jpg" alt=""/></p>
      </div>
      <button class="open-app" @click="openApp()">打开壹键哥APP</button>
    </div>
  </div>
</template>

<script>
import openApp from "./OpenApp";

export default {
  name: "registerResult",
  data() {
    return {
      voucherValue:0,
      voucherType:'代金券',
      isVoucher:false,
      gw:"",
      tips:false
    };
  },
  components: {
    openApp
  },
  created() {},
  methods: {
    openApp() {
      this.$refs.openApp.openApp();
    },
    // 获取注册用户代金券
    getVoucher() {
      // this.$http.post("/api/voucher").then(
      //   res => {
      //     const result = res.data;
      //     this.gw = result.gw;
      //     if (!result.mobile) {
      //       this.$layer
      //         .dialog({
      //           content: "该账号未绑定手机号，请去盖象商城绑定",
      //           btn: ["知道了"]
      //         })
      //         .then(res => {
      //           if (res === 0) {
      //             this.$router.back();
      //           }
      //         });
      //       return false;
      //     }
      //     if (parseInt(result.data.status) === 1000) {
      //       if( result.data.voucher.length > 0){
      //         this.isVoucher = true;
      //         this.voucherValue = result.data.voucher[0].deductionValue
      //          // 有代金券就提示
      //         this.mdShow = true;
      //         switch(result.data.voucher[0].voucherType){
      //           case 1:
      //             this.voucherType = '推荐代金券';
      //             break;
      //           case 101:
      //             this.voucherType = '拉新代金券';
      //             break;
      //           default:
      //           break;
      //         }
      //       }
      //     } else {
      //       console.log("该账号无代金券");
      //     }
      //   },
      //   res => {
      //     console.log("代金券接口异常稍后重试");
      //   }
      // );
        this.gw = this.$route.query.gwCode;
        this.tips = this.$route.query.tips;
        if(this.tips){
          this.$http.post('/api/getUserVoucherByCode').then((rte)=>{
            let resultVoucher = rte.body
            if(rte.body.code === '1000'){
                if(resultVoucher.resData.isGetVouchers){
                    this.isVoucher = true
                    this.voucherValue = resultVoucher.resData.vouchersAmount
                }else{
                    this.isVoucher = false
                }
            }
        })
        }
        
    }
  },
  mounted() {
    this.getVoucher();
  }
};
</script>

<style scoped>
.prompt {
  text-align: center;
  font-size: 0.4rem;
  line-height: 0.8rem;
}
.result {
  width: 4rem;
  margin: 1.2rem auto 0.24rem;
  line-height: 1.2rem;
}
.result p {
  float: left;
  width: 1.2rem;
  height: 1.2rem;
  border-radius: 50%;
  background: #09bebf;
  margin-left: 0.4rem;
}
.result p > img {
  width: 0.64rem;
  height: 0.44rem;
  vertical-align: middle;
}
.prompt > span {
  color: #ffd800;
}
.app-login {
  width: 6.6667rem;
  padding: 0.4rem 0.24rem;
  background: #efeff4;
  margin: 0.5333rem auto 0;
  line-height: 0.56rem;
  font-size: 0.32rem;
}

.pages {
  width: 7.2rem;
  margin: 0.88rem auto;
  overflow: hidden;
  padding-bottom: 0.1333rem;
}
.pages p {
  float: left;
  width: 33.33%;
  text-align: center;
  margin-top: 1.6rem;
  box-sizing: border-box;
}
.pages p:nth-child(2) {
  margin-top: 0.8rem;
}
.pages p:last-child {
  margin: 0;
}
.pages p img {
  width: 80%;
  height: 3.6rem;
  margin: 0 0.2667rem;
  box-shadow: 0.04rem 0.04rem 0.1333rem #3e435d;
  box-sizing: border-box;
}

.open-app {
  display: block;
  width: 7.2rem;
  height: 1.2rem;
  background: #ffd800;
  color: #5a66b1;
  margin: 0 auto;
  border-radius: 0.16rem;
}
</style>
